{% extends "service_log/sl_base.html" %}

{% load attach_tags %}
{% load widget_tweaks %}
{% load qa_tags %}
{% load i18n %}
{% load static %}

{% block head_title %}{% trans "Edit Part" %}: {{ part.name }}{% endblock %}

{% block extra_css %}
  {{ block.super }}
  <link href="{% static "daterangepicker/css/daterangepicker.css" %}?v={{ VERSION }}" rel="stylesheet">
  <link href="{% static "qatrack_core/css/custom-daterangepicker.css" %}?v={{ VERSION }}" rel="stylesheet">
  <link href="{% static "select2/css/select2.min.css" %}?v={{ VERSION }}" rel="stylesheet">
  <link href="{% static "qatrack_core/css/tables.css" %}?v={{ VERSION }}" rel="stylesheet">
  <link href="{% static "qatrack_core/css/custom-select2.css" %}?v={{ VERSION }}" rel="stylesheet">
{% endblock extra_css %}

{% block require_javascript %}
  require(['p_part']);
{% endblock require_javascript %}

{% block body %}

<form action="" method="post" novalidate enctype="multipart/form-data">
  {% csrf_token %}
  <div class="max-width-lg">
    <div class="row">
      <div class="col-md-3">
        {% if form.instance.id %}
        <h3 class="no-margin-top">{% trans "Edit Part" %} {{ form.instance.id }}</h3>
        {% else %}
        <h3 class="no-margin-top">{% trans "Create Part" %}</h3>
        {% endif %}
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <div class="box">
          <div class="box-header"></div>
          <div class="box-body">
            <div class="row" style="display: none;">
              {% for field in form.fieldsets.hidden_fields %}
                  {{ field }}
                  {% if field.errors %}
                      {{ field.errors }}
                  {% endif %}
              {% endfor %}
            </div>
            <div class="row">
              <div class="col-md-6 form-horizontal">
                {% for field in form.fieldsets.name %}
                  <div class="form-group{% if field.errors %} has-error{% endif %}" title="{{ field.help_text }}">

                    <label for="{{ field.id_for_label }}" class="col-sm-4">
                      {{ field.label }}
                      {% if field.help_text %}
                          <div class="help-block margin-0">{{ field.help_text }}</div>
                      {% endif %}
                    </label>

                    <div class="col-sm-8">
                      {{ field }}
                    </div>

                    {% for e in field.errors %}
                      <div class="col-sm-4"></div>
                      <div class="col-sm-8 help-block text-center">{{ e }}</div>
                    {% endfor %}

                  </div>
                {% endfor %}

              </div>
            </div>
            <div class="row">
              <div class="col-md-6 form-horizontal">
                {% for field in form.fieldsets.required_fields %}
                  <div class="form-group{% if field.errors %} has-error{% endif %}" title="{{ field.help_text }}">
                    <label for="{{ field.id_for_label }}" class="col-sm-4">
                        {{ field.label }}
                        {% if field.help_text %}
                          <div class="help-block margin-0">{{ field.help_text }}</div>
                        {% endif %}
                    </label>
                    <div class="col-sm-8">
                        {{ field }}
                    </div>
                    {% for e in field.errors %}
                      <div class="col-sm-4"></div>
                      <div class="col-sm-8 help-block text-center">{{ e }}</div>
                    {% endfor %}
                  </div>
                {% endfor %}
              </div>
              <div class="col-md-6 form-horizontal">

                {% for field in form.fieldsets.optional_fields %}
                  <div class="form-group {% if field.errors %}has-error{% endif %}" title="{{ field.help_text }}">
                    <label for="{{ field.id_for_label }}" class="col-sm-4">
                      {{ field.label }}
                      {% if field.help_text %}
                        <div class="help-block margin-0">{{ field.help_text }}</div>
                      {% endif %}
                    </label>
                    <div class="col-sm-8">
                        {{ field }}
                    </div>
                    {% for e in field.errors %}
                      <div class="col-sm-12 help-block text-center">{{ e }}</div>
                    {% endfor %}
                  </div>
                {% endfor %}
              </div>
            </div>
            <div class="row">
              {% for field in form.fieldsets.notes %}
                <div class="col-sm-12 form-horizontal">
                  <div class="form-group {% if field.errors %}has-error{% endif %}" title="{{ field.help_text }}">
                    <div class="col-sm-12">
                      <label for="{{ field.id_for_label }}" class="">
                        <span>{{ field.label }}</span>
                        {% if field.help_text %} - <span class="help-block margin-bottom-0 display-inline-block">{{ field.help_text }}</span>{% endif %}
                      </label>
                      {{ field }}
                      {% for e in field.errors %}
                          <div class="col-sm-12 help-block text-center">{{ e }}</div>
                      {% endfor %}
                    </div>
                  </div>
                </div>
              {% endfor %}
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-5">

        <div class="box">
          <div class="box-header">
            <h4 class="box-title">{% trans "Suppliers" %}</h4>
          </div>

          <div class="box-body">
            <table class="table table-condensed table-hover">
              <thead>
                <tr>
                  <th>{% trans "Supplier" %}</th>
                  <th>{% trans "Supplier Specific Part #" %}</th>
                  <th>{% trans "Delete" %}</th>
                </tr>
              </thead>
              <tbody>
                {{ supplier_formset.management_form }}
                {% for e in supplier_formset.non_form_errors %}
                  <tr>
                    <td colspan="5" class="has-error">
                      <div class="help-block text-center">{{ e }}</div>
                    </td>
                  </tr>
                {% endfor %}
                {% for sup_form in supplier_formset %}
                  {{ sup_form.part }}
                  {{ sup_form.id }}
                  <tr>
                    <td class="min-width-200 {% if sup_form.supplier.errors %}has-error{% endif %}">
                      {{ sup_form.supplier }}
                    </td>
                    <td class="{% if sup_form.part_number.errors %}has-error{% endif %}">{{ sup_form.part_number }}</td>
                    <td align="center">{% if sup_form.instance.id %}{{ sup_form.DELETE }}{% endif %}</td>
                  </tr>
                {% endfor %}
              </tbody>
              <tfoot>
              </tfoot>
            </table>
          </div>

        </div>
      </div>

      <div class="col-md-7">

        <div class="box">
          <div class="box-header">
            <h4 class="box-title">{% trans "Storage" %}</h4>
          </div>

          <div class="box-body">
            <table class="table table-condensed table-hover">
              <thead>
                <tr>
                  <th>{% trans "Room" %}</th>
                  <th>{% trans "Location" %}</th>
                  <th class="max-width-75">{% trans "Quantity" %}</th>
                  <th>{% trans "Delete" %}</th>
                </tr>
              </thead>
              <tbody>
                {{ storage_formset.management_form }}
                {% for e in storage_formset.non_form_errors %}
                  <tr>
                    <td colspan="5" class="has-error">
                      <div class="help-block text-center">{{ e }}</div>
                    </td>
                  </tr>
                {% endfor %}
                {% for sto_form in storage_formset %}
                  {{ sto_form.part }}
                  {{ sto_form.id }}
                  {% for e in sto_form.non_field_errors %}
                    <tr>
                      <td colspan="5" class="has-error">
                        <div class="help-block text-center">{{ e }}</div>
                      </td>
                    </tr>
                  {% endfor %}
                  <tr class="{% if sto_form.non_field_errors %}border-error{% endif %}">
                    <td style="display: none;">
                      {{ sto_form.storage_field }}
                    </td>
                    <td class="min-width-150 room-td{% if sto_form.room.errors %} has-error{% endif %}">
                      {{ sto_form.room }}
                      {% for e in sto_form.room.errors %}
                        <div class="help-block text-center">{{ e }}</div>
                      {% endfor %}
                    </td>
                    <td class="min-width-100{% if sto_form.location.errors %} has-error{% endif %}">
                      {{ sto_form.location }}
                      {% for e in sto_form.location.errors %}
                        <div class="help-block text-center">{{ e }}</div>
                      {% endfor %}
                    </td>
                    <td class="max-width-75{% if sto_form.quantity.errors %} has-error{% endif %}">
                      {{ sto_form.quantity }}
                      {% for e in sto_form.quantity.errors %}
                          <div class="help-block text-center">{{ e }}</div>
                      {% endfor %}
                    </td>
                    <td align="center">{% if sto_form.instance.id %}{{ sto_form.DELETE }}{% endif %}</td>
                  </tr>
                {% endfor %}
              </tbody>
              <tfoot></tfoot>
            </table>
          </div>

        </div>

      </div>
    </div>

    <div class="row">
      <div class="col-md-5">
        <div class="box">
          <div class="box-header">
            <h3 class="box-title{% if form.part_attachments.errors %} has-error{% endif %}">
              <i class="fa fa-cog fa-fw" aria-hidden="true"></i>
              Attachments
            </h3>
          </div>
          <div class="box-body">
            <div class="row">
              <div class="col-sm-12">
                <table id="attach-table" class="table table-responsive table-condensed">
                  <thead>
                    <tr>
                      <th>Filename</th>
                      <th>Delete</th>
                    </tr>
                  </thead>
                  <tbody>
                    {{ form.part_attachments_delete_ids }}
                    {% if form.instance.id %}
                      {% for attach in form.instance.attachment_set.all %}
                        <tr>
                          <td><i class="fa fa-paperclip fa-fw" aria-hidden="true"></i>{{ attach | attachment_link }}</td>
                          <td align="center"><input type="checkbox" name="attach-{{ attach.id }}-DELETE" id="attach-{{ attach.id }}-DELETE" class="attach-delete" value="{{ attach.id }}"></td>
                        </tr>
                      {% endfor %}
                    {% endif %}
                  </tbody>
                  <tfoot id="part-attachment-names"></tfoot>
                </table>
              </div>
            </div>
          </div>
          <div class="box-footer">

            {% if perms.attachments.add_attachment %}
              <div class="form-group{% if form.part_attachments.errors %} has-error{% endif %}">
                {% for error in form.part_attachments.errors %}
                  <div class="col-sm-12 help-block text-center">{{ error }}</div>
                {% endfor %}
              </div>
              <label class="qa-input btn btn-default btn-sm btn-flat pull-right" title="Click to add attachments. (Hold Ctrl or Cmd in the dialog to include multiple attachments)">
                Browse {{ form.part_attachments }}
              </label>
            {% endif %}
          </div>
        </div>
      </div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <input name="submit" class="btn btn-flat btn-primary pull-right" type="submit" value="{% if form.instance.id %}{% trans "Save Part" %}{% else %}{% trans "Add Part" %}{% endif %}" />
        {% if not form.instance.id %}<input name="submit_add_another" class="btn btn-flat btn-primary pull-right margin-r-5" type="submit" value="{% trans "Add Part and enter another" %}" />{% endif %}
      </div>
    </div>
  </div>

</form>

<script id="attach-template" type="text/template">
    <div class="col-sm-6">
        <div class="row">
            <div class="col-sm-6">
                <a target="_blank" href="<%= a.url %>">
                    <img class="img-responsive" src="<%= a.url %>" alt="<%= a.name %>"/>
                </a>
            </div>
            <div class="col-sm-6">
                <dl>
                    <dt>File</dt>
                    <dd>
                        <a target="_blank" href="<%= a.url %>"><%= a.name %></a>
                    </dd>

                    <dt>Size</dt>
                    <dd><%= a.size %></dd>
                </dl>
            </div>
        </div>
    </div>
</script>

{% endblock body %}
